<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <base href="<%=basePath%>">
  <meta charset="utf-8">
  <title>生产出库出库查询</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="layuiadmin/style/admin.css" media="all">
  <style type="text/css">
    /*表格单选框居中 */
	.layui-table-cell .layui-form-radio {
		position: relative;
		top: 50%;
	}
	/* 禁止刷新后出现横向滚动条 */
	body{overflow-y: scroll;} 
  </style>
</head>
<body>
	<div class="layui-fluid">
	  <div class="layui-row layui-col-space10">
	  	<div class="layui-col-md12">
			<div class="layui-card">
		      <div class="layui-form layui-card-header layuiadmin-card-header-auto">
		        <div class="layui-form-item">
		          <div class="layui-inline">
		            <label class="layui-form-label">生产编号</label>
		            <div class="layui-input-inline">
		              <input type="text" name="producecode" id="producecode" placeholder="请输入生产编号" autocomplete="off" class="layui-input">
		            </div>
		          </div>
		          <div class="layui-inline">
		            <label class="layui-form-label">状态</label>
		            <div class="layui-input-inline">
		            	<select name="status">
			              	<option value="">请选择</option>
			                <option value="新建">新建</option>
			                <option value="已上线">已上线</option>
			                <option value="已暂停">已暂停</option>
			                <option value="已下线">已下线</option>
			            </select>
		            </div>
		          </div>
		          <div class="layui-inline">
		            <button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="LAY-produceinfo-contlist-search">
		              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
		            </button>
		          </div>
		        </div>
			</div>
			<div class="layui-card-body">
			  <table id="LAY-produceinfo-content-list" lay-filter="LAY-produceinfo-content-list"></table> 
			  <script type="text/html" id="toolbarDemo">
  				<div class="layui-btn-container">
    				<button class="layui-btn layuiadmin-btn-list" lay-event="outdepot">材料出库</button>
  				</div>
			</script>
			  <script type="text/html" id="table-producematerial-content-list">
          			<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="outdepot"><i class="layui-icon layui-icon-edit"></i>材料出库</a>
          	  </script>
	      	</div>
	      </div>
	   </div>
  
       <div class="layui-col-md12">
          <div class="layui-card">
            <div class="layui-card-header">生产材料信息</div>
            <div class="layui-card-body">
              <table id="LAY-producematerial-content-list" lay-filter="LAY-producematerial-content-list"></table> 
            </div>
          </div>
       </div>
    </div>   
  </div>
  <script src="layuiadmin/layui/layui.js"></script>  
  <script>
  layui.config({
    base: 'layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'contlist', 'table', 'laydate'], function(){
    var table = layui.table
    ,admin = layui.admin
    ,laydate = layui.laydate
    ,form = layui.form;
    
    laydate.render({
		elem: '#date', //弹出页的指定元素生日时期需要为时间格式
	});
    
    table.render({
        elem: '#LAY-produceinfo-content-list'
         ,url:'produceinfo/findListJson/'
         ,toolbar: '#toolbarDemo'
        ,limit:10
        ,limits:[10,20,30,40,50,60,70,80,90]
        ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
        ,cols: [[
                  {type:'radio'}   
                 ,{type:'numbers', title: '序号'}
	             ,{field:'producecode', title: '生产任务编号', sort: true}
	       		 ,{field:'productname', title: '产品名称', sort: true}
                 ,{field:'linename', title: '生产线', sort: true}
                 ,{field:'amount', title: '生产数量', sort: true}
                 ,{field:'outamount', title: '材料出库数', sort: true}
                 ,{field:'addtime', title: '创建时间', sort: true}
                 ,{field:'onlinetime', title: '上线时间', sort: true}
                 ,{field:'offlinetime', title: '下线时间', sort: true}
                 ,{field:'status', title: '状态', sort: true}
        ]]
    	,page: true
    	,done: function(res, curr, count){
        	initProducematerialTable();
    	}
	    ,parseData: function(res){ //res 即为原始返回的数据
		    if(res.data[0] != undefined){
		    	res.data[0].LAY_CHECKED=true
			       return {
			         "code": res.code, //解析接口状态
			         "msg": res.msg, //解析提示文本
			         "count": res.count, //解析数据长度
			         "data": res.data //解析数据列表
			       };
		    }
	     }
      });
    
    //监听搜索
    form.on('submit(LAY-produceinfo-contlist-search)', function(data){
      var field = data.field;
      //执行重载
      table.reload('LAY-produceinfo-content-list', {
        where: field
        ,page: {
            curr: 1 //重新从第 1 页开始
        }
      });
    });
    
    //监听产线行单击事件（双击事件为：rowDouble）
    table.on('row(LAY-produceinfo-content-list)', function(obj) { //注：test是table原始容器的属性 lay-filter="对应的值"
    	var data = obj.data;
    	//选中行样式
    	obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
    	//选中radio样式
    	obj.tr.find('i[class="layui-anim layui-icon"]').trigger("click");
    	
    	//重载工具表格数据
        table.reload('LAY-producematerial-content-list', {
          where: {producecode:data.producecode}
        });
    });

    //头工具栏事件
    table.on('toolbar(LAY-produceinfo-content-list)', function(obj){
      
      switch(obj.event){
        case 'outdepot':  //添加
        	var ids = [];//封装批量删除的ID
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data;
            
            if(data.length === 0){
                return layer.msg('请选择数据');
            }
            
            if("已上线" != data[0].status){
       		  layer.msg('只有已上线的生产任务才能进行材料出库！');
       		  return;
            } 
            
            if("已完成" == data[0].outstatus){
       		  layer.msg('该生产任务所需的材料已经全部出库完成');
       		  return;
       	    } 
            
            layer.open({
                type: 2
                ,title: '材料出库'
                ,content: 'producematerial/outdepotInit?id='+data[0].id
                ,maxmin: true
                ,area: ['900px', '600px']
                ,btn: ['确定', '取消']
                ,yes: function(index, layero){
                  //点击确认触发 iframe 内容中的按钮提交
                  var submit = layero.find('iframe').contents().find("#layuiadmin-producematerial-form-submit");
                  submit.click();
                }
  	          ,end: function () {
  	        	table.reload('LAY-produceinfo-content-list');
  	          	table.reload('LAY-producematerial-content-list');
  	          }
           });
        break;
      };
    });
    
    
    //初始化材料信息
    function initProducematerialTable(){
    	 //初始化工段信息
        table.render({
            elem: '#LAY-producematerial-content-list'
            ,url:'producematerial/findListJson/'
            ,where:selectProduceinfocode()
            ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            ,limit:10
            ,limits:[10,20,30,40,50,60,70,80,90]
            ,cols: [[
               {type:'numbers', title: '序号'}
      		  ,{field:'materialcode', title: '材料编号', sort: true}
      		  ,{field:'materialname', title: '材料名称', sort: true}
      		  ,{field:'peramount', title: '单件需要数', sort: true}
      		  ,{field:'amount', title: '需求总量', sort: true}
      		  ,{field:'outamount', title: '已出库量', sort: true}
      		  ,{field:'status', title: '状态', sort: true}
            ]]
        	,page: true
        });
    }
    
    //将表单数据转为json
	function selectProduceinfocode(){
		//获取选中的流水线
		var checkStatus = table.checkStatus('LAY-produceinfo-content-list');
	    var data = checkStatus.data;
	    var producecode = -100;
	    if(data == '' || data[0] == undefined || data[0].producecode == undefined){
	    	producecode = -100;
	    }else{
	    	producecode = data[0].producecode;
	    }
		var json = {
			producecode:producecode,
		};
		
		return json;
	}
    
	//监听工段行单击事件（双击事件为：rowDouble）
    table.on('row(LAY-producematerial-content-list)', function(obj) { //注：test是table原始容器的属性 lay-filter="对应的值"
    	var data = obj.data;
    	//选中行样式
    	obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
    	//选中radio样式
    	obj.tr.find('i[class="layui-anim layui-icon"]').trigger("click");
    });
    
  });
 
  </script>
</body>
</html>